<#import "../tpl/pageTep.ftl" as page>
    <@page.pageBase currentMenu="检测项目管理">
<style>
    .progress span{
        display: inline-block;
        height: 20px;
        background-color: #4ddaff;
    }
    .webuploader-pick {
        width:120px;
        position: relative!important;
        display: inline-block!important;
        cursor: pointer!important;
        background: #00b7ee!important;
        padding: 8px 15px!important;
        color: #fff!important;
        text-align: center!important;
        border-radius: 3px!important;
        overflow: hidden!important;
    }
</style>
 <form id="searchForm" class="form-panel" action="${basepath}/rest/manage/testproject/loadData">
     <ul class="panel-content">
         <li>
             <div class="form-actions">
                 <div class="control-group controls span5">
                     <input type="text" id="searchForm" class="input-normal  input-pad" name="name"
                            placeholder="请输入关键字搜索">
                 </div>
                 <button type="submit" class="button  button-primary">
                     查询
                 </button>
                 <a class="button button-primary" href="${basepath}/rest/manage/testproject/toAdd" style="margin-left: 20px;">
                     新增
                 </a>
                 <a class="button button-danger" style="margin-left: 20px;" onclick="return delFunction()">
                     批量删除
                 </a>
                 <a class="button button-primary" href="javascript:add()"  style="margin-left: 20px;">
                     导入
                 </a>
                 <a class="button button-primary" href="${basepath}/rest/manage/testproject/excelDownload" style="margin-left: 20px;">
                     导出
                 </a>
                 <div class="contract-button">
                     <a class="button button-primary" href="${basepath}/rest/manage/testprojectcategory/toList">
                         目录管理
                     </a>
                 </div>

             </div>
         </li>
     </ul>
 </form>
    <div id="grid"></div>
    <#------------------------------------------导入Excel弹出框-------------------------------------------------->

<div id="uploader" class="wu-example" style="display:none">
    <div class="btns">
        <div id="picker">选择Excel文件</div>
    </div>
    <!--用来存放文件信息-->
    <div id="thelist" class="uploader-list"></div>
</div>
<script>
var Grid = BUI.Grid,
        Store = BUI.Data.Store,
        columns = [
            {title : '序号',elCls: 'center', dataIndex :'id', width:'5%',renderer:function (value, obj, index) {
                    return index+1;
                }},
            {title : '检测对象',dataIndex :'categoryName',elCls: 'center', width:'10%'},
            {title : '检测项目',dataIndex :'name', elCls: 'center', width:'10%'},
            {title : '价格',dataIndex :'price', elCls: 'center', width:'5%'},
            {title : '方法依据',dataIndex :'accordingTo',elCls: 'center', width:'10%'},
            {title : '检出限',dataIndex :'detectionLimit', elCls: 'center', width:'10%'},
            {title : '检出限单位',dataIndex :'detectionLimitUnit',elCls: 'center', width:'10%'},
            {title : '资质',dataIndex :'aptitude', elCls: 'center', width:'10%'},
            {title : '检测方法',dataIndex :'testMethod', elCls: 'center', width:'10%'},
            {title : '备注',dataIndex :'remark', elCls: 'center', width:'10%'},
            {title : '操作',dataIndex : 'id',elCls: 'center',width:'10%',renderer : function (value) {
                    return '<a href="${basepath}/rest/manage/testproject/toEdit?id=' + value + '">编辑</a>&nbsp;&nbsp;<a href="javascript:deleteOne(' +value+ ')">删除</a>';
                }
            }
        ];

var store = new Store({
            url : '${basepath}/rest/manage/testproject/loadData',
            autoLoad:true, //自动加载数据
            params : { //配置初始请求的参数
                length : '10',
                status:$("#status").val()
            },
            pageSize:10,	// 配置分页数目
            root : 'list',
            totalProperty : 'total'
        }),
        grid = new Grid.Grid({
            render:'#grid',
            columns : columns,
            loadMask: true, //加载数据时显示屏蔽层
            store: store,
            plugins : [Grid.Plugins.CheckSelection], // 插件形式引入多选表格
            // 底部工具栏
            bbar:{
                pagingBar:true
            }
        });

grid.render();


//删除选中的记录
function delFunction(){
    var selections = grid.getSelection();
    var ids=new Array();
    for(var i=0;i<selections.length;i++){
        ids[i]=selections[i].id.toString()
    }
    $.ajax({
        type: "POST",
        url: "${basepath}/rest/manage/testproject/deletesJson",
        dataType: "json",
        data: {
            ids:ids
        },
        success: function (data) {
            var obj = new Object();
            obj.start = 0; //返回第一页
            store.load(obj);
        }
    });
}
/**********************删除单个信息*************************/
function deleteOne(value) {
    BUI.Message.Confirm('确定要执行删除操作？', function () {
        $.ajax({
            type: 'POST',
            url: '${basepath}/rest/manage/testproject/deleteJson',
            dataType: 'json',
            data: {
                id: value
            },
            success: function () {
                var obj = new Object();
                obj.start = 0; //返回第一页
                store.load(obj);
            }
        });
    }, 'question');
}
/*********************************文件上传弹出框**********************************************/
var addDialog = new BUI.Overlay.Dialog({
    title: '导入Excel文件',
    width: 400,
    height: 200,
    contentId: 'uploader',  //弹出框显示内容的DOM容器ID
    success: function () {   //每次点击弹出框的确定时执行上传文件
        uploader.upload();
    }
});
function add() {//点击添加时弹出框显示
    $("#thelist").empty(); //每次点击添加时清除$("#thelist")元素的子元素
    addDialog.show();
    $(".webuploader-pick").next().css({"width": "150px", "height": "52px"});           //更改样式防止找不到按钮
}
/******************************基于webupload插件弹出框文件上传********************************/
var uploader = WebUploader.create({
    auto: false,
    // swf文件路径
    swf: '${staticpath}/ueditor/third-party/webuploader/Uploader.swf',
    // 文件接收服务端。
    server: '${basepath}/rest/manage/testproject/excelUpload',
    // 选择文件的按钮。可选。
    pick: '#picker',
    //设置事件监听超时时间，0表示不设置超时时间
    timeout: 30 * 60 * 1000,
    // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
    resize: false,
    duplicate: true
});
//验证进来的文件是否为Excel文件
uploader.on('fileQueued', function (file) {
    $("#thelist").empty();//每次有文件进来先清理之前提示信息
    var fileType = file.name.substr(file.name.lastIndexOf("."));
    if (fileType == '.xls' || fileType == '.xlsx') {
        $("#thelist").append('<div id="' + file.id + '" class="item">' +
                '<h4 class="info">' + file.name + '</h4>' +
                '</div>');
    }
    else {
        BUI.Message.Alert('请选择Excel文件！', 'error');
    }
});
//文件上传成功
uploader.on('uploadSuccess', function (file) {
    $('#' + file.id).find('p.state').text('已上传');
    BUI.Message.Alert('文件导入成功！','success');
    var obj = form.serializeToObject();
    obj.start = 0; //返回第一页
    store.load(obj); //重新从第一页开始加载数据
    addDialog.close();  //文件上传提交成功，弹出框关闭
});
uploader.on('uploadProgress', function (file, percentage) {
    var $li = $('#' + file.id);
    $li.find('p.state').text('上传中，如果数据量较大请耐心等待哦...');
});
//文件上传失败
uploader.on('uploadError', function (file) {
    BUI.Message.Alert('上传失败，文件部分填写错误或未填写完整！','error');
    var obj = form.serializeToObject();
    obj.start = 0; //返回第一页
    store.load(obj); //重新从第一页开始加载数据
    addDialog.close();
});
//文件上传结束
uploader.on('uploadComplete', function (file) {
    $('#' + file.id).find('.progress').fadeOut();
});
/**********************模糊搜索*************************/
var form = new BUI.Form.HForm({
    srcNode: '#searchForm'
}).render();

form.on('beforesubmit', function (ev) {
    //序列化成对象
    var obj = form.serializeToObject();
    obj.start = 0; //返回第一页
    store.load(obj);
    return false;
});
</script>

</@page.pageBase>
